<!--  -->
<template>
  <div class="maxbg">
    <transition name="fade">
      <div class="pageBody g-bg">
        <!-- <div class="dt-top pay-head">
          <div class="promotion-close" @click="goback"></div>
          <div class="tl">推广规则</div>
        </div> -->
        <div class=" promotion-rule">
          <div class="title">一、推广方法</div>
          <div class="paragraph">1. 销售产品: 分销员通过芝士医生“标本库详情、课程详情、题库详情、会员产品”分享给其他用户，用户通过链接进入购买后，成为该分销员的客户，后期客户自主消费都会给分销员分佣；
            <br />2. 推广分销员下级：分销员通过团队邀请码，邀请其他用户成为你的下级，绑定成功之后，下级销售后会得到一级分销佣金。
          </div>

          <div class="title">二、绑定关系</div>
          <div class="paragraph">1. 销售关系: 推广员销售商品“分享商品”，例如A分享商品给到B，B购买之后成为A的销售客户；
            <br />2. 上下级推广关系：推广员发展下级，例如A展示自己的推广二维码，B扫码后跟A绑定上下级关系，B自己消费或者分享给自己客户消费，消费之后A可以获得一级分佣；
            <br />3. 销售关系、上下级推广关系一旦绑定之后，后面再进行分享之类的动作，也不会再重新绑定和分佣；
            <br />4. 确保自己能拿到分佣，需要确认当前客户没有绑定关系，这样才能顺利和该客户建立绑定关系。
          </div>

          <div class="title">三、分佣规则</div>
          <!-- <div class="ruleimg employeeimg" v-if="type == 1"></div>
          <div class="ruleimg personalimg" v-else></div> -->
          <div class="myTable">
            <div class="rtext"> 佣金系数&nbsp;{{ ratio }} </div>
            <table border="1" cellpadding="0" cellspacing="0"> 
              <thead>
              <tr>  
                <th class="" rowspan="2">提点类型</th>  
                <th colspan="4">产品佣金比例</th>
              </tr>  
              <tr>  
                <td>VIP </td>  
                <td>题库 </td>
                <td>标本库 </td>    
                <td>课程 </td>  
              </tr>  
            </thead> 
            <tbody>
              <tr v-for="item in tableData"> 
                <th class="">{{sourceType[item.source] }}</th>
                 <td class=""> {{ (item.ratio[0]/100) + '%' }} </td>
                 <td class=""> {{ (item.ratio[1]/100) + '%' }} </td>
                 <td class=""> {{ (item.ratio[2]/100) + '%' }} </td>
                 <td class=""> {{ (item.ratio[3]/100) + '%' }} </td>
              </tr>
            </tbody>    
            </table> 
          </div>

          <!-- 公司员工 -->
          <div v-if="type == 1">
            <div class="title">四、结算规则</div>
            <div class="paragraph">
              下月15-16号结算上个自然月的整体业绩(超过退换货周期: 7天无理由，15天可退换);
            </div>
          </div>
          <!-- 个人 -->
          <div v-else>
            <div class="title">四、结算/提现规则</div>
            <div class="paragraph">
              1. 下月15-16号结算上个自然月的整体业绩(超过退换货周期: 7天无理由，15天可退换);
              <br />2. 每月仅限提现一次；
              <br />3. 每月提现限定时间区间，每月的20-25日；
              <br />4. 提现针对个税问题：
              <br />&nbsp;&nbsp;&nbsp;&nbsp;4.1. 每月提现800元以下(包含800)，不收取个税；
              <br />&nbsp;&nbsp;&nbsp;&nbsp;4.2. 每月提现800元以上 - 4000元以下(包含4000)，应缴纳税额=(提现金额-800)*20%；
              <br />&nbsp;&nbsp;&nbsp;&nbsp;4.3. 每月提现4000元以上 - 20000元以下(包含20000)，应缴纳税额=提现金额*(1-20%)*20%；
              <br />5. 限额: 每月最多提现金额为20000元；
              <br />6. 提现需要提供个人支付宝账号“支付宝账号信息需和姓名保持一致”，还需提供真实姓名、身份证号、身份证正反面照片!
            </div>
          </div>

        </div>
      </div>
    </transition>
  </div>
</template>

<script>
export default {
  data() {
    return {
      type: 1,// 个人 公司
      id:'', // 佣金系数
      sourceType: { // 提成来源
        1: '自行销售',
        2: '一级分销',
        3: '二级分销',
        4: '分销返积分'
      },
      orderTypeList: [ // 订单类型
        {
          id: 8,
          label: 'VIP',
        },
        {
          id: 4,
          label: '题库',
        },
        {
          id: 2,
          label: '标本库',
        },
        {
          id: 1,
          label: '课程',
        },
      ],
      tableData:[],
      ratio:'' 
    };
  },
  components: {},
  created() {
    this.type = this.$route.query.type
    this.id = this.$route.query.id
    if(this.type){
      this.getRatioData()
    }
  },
  mounted() {

  },

  methods: {
    goback() {
      this.$router.go(-1);
    },
    getRatioData(){
      let data = { typeId: this.id }
      this.$http
        .getRatioData(data)
        .then((res) => {
          if (res.flag === 0) {
            this.ratio = res.data.ratio
            const udata = res.data.commissionRatios
            let arr = [] // 所有source
            udata.forEach(item => {
              arr.push(item.source) 
            })
            let newarr = Array.from(new Set(arr)); // 去重
            // console.log(newarr,'newarr');
            let result = newarr.map(source => ({  
              source,
              ratio: udata.filter(item => item.source === source).map(item => item.ratio)  
            })); 
            // console.log(result);
            this.tableData = result

          } else {
            console.log(res.message);
          }
        })
        .catch((err) => {
          console.log(err.response.data.message);
        });
    },
  }
};
</script>

<style lang='scss' scoped></style>
